<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <link rel="stylesheet" href="css/allBasic.css">
    <!--<link rel="stylesheet" href="css/sitePage.css">-->
    <link rel="stylesheet" href="css/mainpage.css">
    <title>首页</title>
</head>
<body>
<div class="mpg_wrap">
    <p class="m_title">钱包类型</p>
    <ul class="wallet_wrap clearfix">
        <li class="item">
            激活钱包
            <p class="num_box"><em class="num">￥18888</em><img src="img/jt_up.png" class="ico"></p>
        </li>
        <li class="item">
            现金钱包
            <p class="num_box"><em class="num">￥18888</em><img src="img/jt_up.png" class="ico"></p>
        </li>
        <li class="item">
            分红钱包
            <p class="num_box"><em class="num">￥18888</em><img src="img/jt_down.png" class="ico"></p>
        </li>
        <li class="item">
            数字资产钱包
            <p class="num_box"><em class="num">￥18888</em><img src="img/jt_down.png" class="ico"></p>
        </li>
        <li class="item">
            股权钱包
            <p class="num_box"><em class="num">￥18888</em><img src="img/jt_up.png" class="ico"></p>
        </li>
        <li class="item">
            消费钱包
            <p class="num_box"><em class="num">￥18888</em><img src="img/jt_down.png" class="ico"></p>
        </li>
        <li class="item">
            复投钱包
            <p class="num_box"><em class="num">￥18888</em><img src="img/jt_up.png" class="ico"></p>
        </li>
    </ul>
    <div class="mdl chart">
        <p class="m_title">资金余额</p>
        <p class="total">￥1888</p>
        <div class="x_scroll">
            <div class="chart" id="chart" style="height:260px;min-width:300px;"></div>
        </div>
    </div>
    <div class="mdl chart">
        <p class="m_title">奖励金额</p>
        <p class="num_box"><em class="num">￥18888</em><img src="img/jt_up.png" class="ico"></p>
        <table class="tb_info">
            <tr>
                <td>直接奖</td>
                <td>￥8888</td>
            </tr>
            <tr>
                <td>管理奖</td>
                <td>￥8888</td>
            </tr>
            <tr>
                <td>对碰奖</td>
                <td>￥8888</td>
            </tr>
            <tr>
                <td>分红奖</td>
                <td>￥8888</td>
            </tr>
            <tr>
                <td>服务奖</td>
                <td>￥8888</td>
            </tr>
        </table>
    </div>
    <div class="clearfix"></div>
    <div class="mdl">
        <p class="m_title">系统公告</p>
        <ul class="news_area">
            <li>
                <a href="newsContent.html" class="ntxt">新闻公告新闻公告新闻公告新闻公告新闻公告新闻公告新闻公告00</a>
                <time class="time">--2016-12-03</time>
            </li>
            <li>
                <a href="newsContent.html" class="ntxt">新闻公告</a>
                <time class="time">--2016-12-12</time>
            </li>
        </ul>
    </div>
</div>
</body>
<script src="js/jquery-3.1.1.min.js"></script>
<script src="../public/js/echarts.min.js"></script>
<script src="js/siteBasic.js"></script>
<script>
    $().ready(function(){
        newsLimit(".news_area .ntxt",25);
        showChart1();
    });
    function showChart1(){
        var mychart=echarts.init(document.getElementById("chart"));
        var option = {
            color:["#7acdea","#88d8c9","#ef7d65"],
            title : {
                text: '',
                x:'center'
            },
            tooltip : {
                trigger: 'item',
                formatter: "{a} <br/>{b} : {c} ({d}%)"
            },
//            grid: { // 控制图的大小，调整下面这些值就可以，
//                x: 60,
//                x2: 260,
//                y2: 60// y2可以控制 X轴跟Zoom控件之间的间隔，避免以为倾斜后造成 label重叠到zoom上
//            },
            legend: {
                orient: 'vertical',
                left: 'right',
                data: ['冻结资金','资金总额','可用余额']
            },
            series : [
                {
                    type: 'pie',
                    radius : '45%',
                    center: ['40%', '60%'],
                    data:[
                        {value:335, name:'冻结资金'},
                        {value:310, name:'资金总额'},
                        {value:234, name:'可用余额'},
                    ],
                    itemStyle: {
                        emphasis: {
                            shadowBlur: 10,
                            shadowOffsetX: 0,
                            shadowColor: 'rgba(0, 0, 0, 0.5)'
                        }
                    }
                }
            ]
        };
        mychart.setOption(option);
    }
    function  showCodeImg(obj){
        $(obj).on("mouseenter",function(){
            $(this).find(".hides").addClass("active");
        }).on("mouseleave",function(){
            $(this).find(".hides").removeClass("active");
        }).on("click",function(){
            $(this).find(".hides").toggleClass("active");
        });
    }
</script>
</html>